﻿@charset "utf-8";
.E-body{ font-size:28px; line-height:1;}
.IMG-body{ background-color:black;}
/* 头部 */
#header{ position:fixed; left:0; top:0; z-index:99; width:100%; height:3em; background:#ac272b;}
#header .head{ margin:0 0.5em; padding:0 2.5em; position:relative; color:#fff; line-height:2.9em;}
#header .head h1{ width:100%; text-align:center; position:relative; font-size:1.2em;}
#header .head a{ position:absolute; display:block; width:2.2em; height:2.2em; top:0.4em; line-height:9em; overflow:hidden; color:#fff}
#header .head a.H-sao{ background:url(../images/H-sao.png) no-repeat center; background-size:2.14em auto; left:0;}
#header .head a.H-back{ background:url(../images/H-back.png) no-repeat center; background-size:0.78em auto; left:0;}
#header .head a.H-mes{ background:url(../images/H-message.png) no-repeat center; background-size:2.14em auto; right:0;}
#header .head a.H-home{ background:url(../images/H-home.png) no-repeat center; background-size:1.5em auto; right:0;}
#header .head a.HScreen{position:absolute; right:0.7em; top:0.75em; background:url(../images/H-SIcn.png) no-repeat left center; background-size:0.9em auto; width:2em; line-height:1.4em; display:block; padding-left:1em;}
#header .head h1 a.H-search{ width:90%; background:#f3dfdf; border-radius:5px; top:0.4em; left:5%; height:2em; line-height:2em; font-size:0.9em; color:#999;}
#header .head h1 a.H-search em{ width:1em; height:1em; display:inline-block; background:url(../images/H-search.png) no-repeat; background-size:0.92em auto; position:relative; top:0.2em; right:0.2em;}
#header .head a.HDistr{position:absolute; right:0.7em; top:0.75em; width:4em; line-height:1.4em; text-align:center; display:block; height:1.4em;}
#header .E-search{position:relative; width:80%; background:#f3dfdf; border-radius:5px; top:0.55em;  height:2.2em; line-height:2.2em; font-size:0.9em; color:#999;}
#header .E-SearText{ width:70%; background:none; border:none; padding-left:5%; line-height:2.2em; float:left;}
#header .E-SearBtn{ width:22%; background:url(../images/H-search.png) no-repeat center; height:2.2em; background-size:0.92em auto; border:0; float:left;}
.WxIcn{ width:1.25em; height:1em; display:inline-block;background:url(../images/WxIcn.png) no-repeat; background-size:1.25em auto; position:relative; top:0.2em; margin-right:0.2em; }
/*--I-search--*/
.I-search{ padding:0.75em 3.125%;}
.I-searchbg{ position:relative; z-index:0; background:#fff; border:1px solid #d9d9d9; border-radius:5px; -moz-border-radius:5px; height:2.2em; padding:0 0.5em 0 2em;}
.I-searchbg em{ position:absolute; top:0.6em; left:0.6em; width:1em; height:1em; background:url(../images/I-searchIcn.png) no-repeat; background-size:1em auto; display:inline-block;}
.I-searchbg a{ display:block; width:100%; line-height:2.2em; color:#b9b9b9;}

/*--navfix--*/
.navfix{ position:fixed; bottom:0; left:0; width:100%; background:#f7f7f7; border-top:1px solid #d9d9d9;}
.navfix li{ width:20%; text-align:center; float:left;}
.navfix li a{ padding:0.5em 0 0.36em; display:inline-block;}
.navfix li em{ width:100%; height:1.75em; display:inline-block; text-align:center;}
.navfix li p{ font-size:0.8em; color:#999; padding-top:0.2em;}
.navfix .F-home em{ background:url(../images/FIcn-home.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-classfic em{ background:url(../images/FIcn-cate.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-cart em{ background:url(../images/FIcn-cart.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-collect em{ background:url(../images/FIcn-collect.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-member em{ background:url(../images/FIcn-mem.png) no-repeat center top; background-size:1.6em auto;}
.navfix li.cur p{ color:#9e2225;}
.navfix .F-home.cur em{ background:url(../images/FIcn-home-on.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-classfic.cur em{ background:url(../images/FIcn-cate-on.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-cart.cur em{ background:url(../images/FIcn-cart-on.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-collect.cur em{ background:url(../images/FIcn-collect-on.png) no-repeat center top; background-size:1.6em auto;}
.navfix .F-member.cur em{ background:url(../images/FIcn-mem-on.png) no-repeat center top; background-size:1.6em auto;}

/*content*/
.main{}
.left{ background-color: #fff; line-height: 2.8em; width: 27.5%; float: left; font-size: 1em; overflow: hidden; position: fixed; left: 0;top: 0; margin-top: 3em; }
.left ul { position: relative; top: 0; margin-bottom:7em;}
.left ul li{  height:2.8em;padding:0.2em 0.5em; overflow: hidden; border-bottom:1px solid #eee; }
.left ul li.on{ background-color: #F2F2F2; color: #fff;}
.left ul li a{ font-size:0.78em; }
.right { line-height: 2em; padding:0.5em  0.5em 4em;float: right; width: 68%; height: auto;  margin-top: 3em; margin-bottom:2em; }
.right ul li{ float: left; width: 30.2%; margin: 0.5%;background-color: #fff; padding:0 1%;  text-align: center; overflow: hidden; height: 2em; line-height: 2em;}
.right ul li a{font-size:0.72em;} 
.right h2{ border-bottom: 1px solid #ccc; text-align: center;}
.right h3{ text-align: center; margin: 0.5em 0em; font-size: 1em; }
.nav{ height: 2em; width: 100%; text-align: center; color: #fff; font-size: 1.5em; position: fixed; background-color: #000; bottom: 0; left: 0; }
/*------------------------CSS Media Queries--------------------------------*/

@media screen and (max-width:319px){
 .E-body{ font-size:10px;}
}
@media screen and (min-width: 320px) and (max-width: 379px){
 .E-body{ font-size:14px;}
}
@media screen and (min-width: 380px) and (max-width: 429px){
 .E-body{ font-size:16.625px;}
}
@media screen and (min-width: 430px) and (max-width: 479px){
 .E-body{ font-size:18.8125px;}
}

@media screen and (min-width: 480px) and (max-width: 639px){
 .E-body{ font-size:21px;}
}
